<template>
  <div>
    <el-row style="margin-bottom:20px;display:flex;justify-content:flex-start">
      <el-input
        placeholder="设备名称"
        v-model="searchmaintain.ep_ename"
        style="width:20%;margin-right:10px"
        clearable
      ></el-input>
      <el-input
        placeholder="规格型号"
        v-model="searchmaintain.scale"
        style="width:20%;margin-right:10px"
        clearable
      ></el-input>
      <el-input
        placeholder="管理编号"
        v-model="searchmaintain.managenum"
        style="width:20%;margin-right:10px"
        clearable
      ></el-input>
      <el-date-picker
        v-model="repairdate"
        clearable
        style="margin-right:15px;width:20%"
        type="daterange"
        rangeSeparator="至"
        startPlaceholder="维护时间"
        endPlaceholder="维护时间"
        valueFormat="yyyy-MM-dd"
      ></el-date-picker>
      <el-input
        placeholder="维护内容"
        v-model="searchmaintain.repair_content"
        style="width:20%;margin-right:10px"
        clearable
      ></el-input>
      <el-input
        placeholder="维护人"
        v-model="searchmaintain.whrname"
        style="width:20%;margin-right:10px"
        clearable
      ></el-input>

      <el-button size="mini" type="primary" @click="geteqmaintainList">搜索</el-button>
    </el-row>
    <el-divider></el-divider>
    <el-button size="mini" type="primary" @click="doprint">打印</el-button>
    <maintainList
      :eqmaintainList="eqmaintainList"
      :choosedp.sync="choosedp"
      :pagobj.sync="pagobj"
      :ismanager="true"
    ></maintainList>
    <el-dialog :visible.sync="showdayin" width="40%">
      <el-form labelWidth="150px">
        <el-form-item label="选择设备" class="is-required" style="width:100%">
          <selecteq :selecteqid.sync="selecteqid" v-if="isselecteq" :itempersonid="selecteqid" style="width:100%;margin-right:10px"
            :isself="false"
          ></selecteq>
        </el-form-item>

        <el-form-item label="选择维护时间" class="is-required" style="width:100%">
          <el-date-picker
            v-model="maintaintime"
            clearable
            style="width:100%"
            type="daterange"
            rangeSeparator="至"
            startPlaceholder="维护时间"
            endPlaceholder="维护时间"
            valueFormat="yyyy-MM-dd"
          ></el-date-picker>

        </el-form-item>
        <el-form-item>
          <span>&nbsp;</span>
        </el-form-item>

      </el-form>
      <el-dialog :visible.sync="innerVisible33" top="0" width="650px" appendToBody>
        <el-button size="mini" type="primary" @click="print">打印</el-button>
        <div id="printrecord2">
          <div>
            <div style="height:50px"></div>
            <p style="display:flex;justify-content:flex-end">
              <span
                style="font-size:15px;color:#000;margin-right:20px"
              >JBR/QR29-8</span>
            </p>
            <table width="100%">
              <thead>
                <tr style="border:0">
                  <th colspan="4" style="border:0;height:50px;line-height:50px;font-size:20px;text-align:center;font-weight:600;color:#333">仪器设备维护记录</th>
                </tr>
                <tr>
                  <th>设备名称</th>
                  <th>{{firsteqdata.hash.ep_ename}}</th>
                  <th>设备编号</th>
                  <th>{{firsteqdata.hash.managenum}}</th>
                </tr>
                <tr>
                  <th>年 月 日</th>
                  <th colspan="2">维护内容</th>
                  <th>维护人</th>
                </tr>
              </thead>
              <tbody>
                <tr v-for="(item, index) in shrecordData" :key="index" style="height:110px">
                  <td>{{item.hash.repair_time}}</td>
                  <td colspan="2">{{item.hash.repair_content}}</td>
                  <td>{{item.hash.username}}</td>
                </tr>

              </tbody>
            </table>
          </div>
        </div>
      </el-dialog>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="showdayin = false">取 消</el-button>
        <el-button size="mini" type="primary" @click="doprinttest">打 印</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import maintainList from '~/components/apparatus/eqmaintain/maintainList.vue';
import selecteq from '~/components/common/selecteq.vue';


export default {
  components: {
    maintainList,
    selecteq,
  },
  data() {
    return {
      ts: this.newStore(),
      selecteqid: {},
      isselecteq: true,
      maintaintime: ['', ''],
      showdayin: false,
      innerVisible33: false,
      shrecordData: {},
      searchmaintain: {},
      isedit: false,
      repairdate: ['', ''],
      eqmaintainList: [],
      firsteqdata: {
        hash: {

        },
      },
      choosedp: [],
      editdata: {},
      isneweqmaintain: false,
      pagobj: {
        currentPage3: 1,
        pagesize: 10,
        total: 10,
      },
    };
  },
  created() {
    this.geteqmaintainList();
  },
  methods: {
    print() {
      this.$nextTick(() => {
        const detailContent = document.getElementById('printrecord2');
        Print('#printrecord2');
      });
    },
    doprinttest() {
      if (this.maintaintime == null) {
        this.maintaintime = ['', ''];
      }
      const req = {
        handle:
          'DD5D108B99FC12B735E83B084D0B700869B8AC1FA85E149EB0C68447069A54E9888636941D7FA35B',
        eid: this.selecteqid.id,

      };
      this.firsteqdata = {
        hash: {

        },
      };
      this.shrecordData = [];
      [req.repair_time_begin] = [this.maintaintime[0]];
      [req.repair_time_end] = [this.maintaintime[1]];
      this.spost(this.ts, '/mainservlet', req).then((ts) => {
        if (ts.d.data.operation1.length > 0) {
          this.shrecordData = ts.d.data.operation1;
          [this.firsteqdata] = [this.shrecordData[0]];
          this.innerVisible33 = true;
        } else {
          this.$message({
            type: 'error',
            message: ' 暂无可打印数据',
          });
        }
      });
    },
    doprint() {
      this.showdayin = true;
      this.isselecteq = false;
      this.$nextTick(() => {
        this.isselecteq = true;
      });
    },
    geteqmaintainList() {
      if (this.repairdate == null) {
        this.repairdate = [];
      }
      const req = this.searchmaintain;
      req.handle =
        'DD5D108B99FC12B735E83B084D0B700869B8AC1FA85E149EB0C68447069A54E9888636941D7FA35B';
      [req.repair_time_begin] = [this.repairdate[0]];
      [req.repair_time_end] = [this.repairdate[1]];
      req.start = (this.pagobj.currentPage3 - 1) * this.pagobj.pagesize;
      req.limit = this.pagobj.pagesize;
      this.spost(this.ts, '/mainservlet', req).then((ts) => {
        this.eqmaintainList = ts.d.data.operation1;
        this.pagobj.total = parseInt(ts.d.data.operation2[0].hash.allrs);
      });
    },
  },
};
</script>
<style scoped>

table {
  text-align: center;
  padding-left: 30px;
  border-collapse: collapse;
}
table td,
th {
  border: 1px solid #333;
  font-size: 14px;
  height: 40px;
  font-weight: normal
}
</style>

